// https://better-scroll.github.io/docs/zh-CN/plugins/observe-dom.html
import BScroll from '@better-scroll/core'
import ObserveDOM from '@better-scroll/observe-dom'
import { onMounted, onUnmounted, ref } from 'vue'

BScroll.use(ObserveDOM)

export default function useScroll (wrapperRef, options, emit) {
  const scroll = ref(null)
  onMounted(() => {
    // 数据异步获取，数据变化，dom发生变化，自动refresh，插件重新计算（内容高度与容器高度）
    const scrollVal = (scroll.value = new BScroll(wrapperRef.value, {
      observeDOM: true,
      ...options
    }))

    // probeType>0才触发滚动事件
    if (options.probeType > 0) {
      // 监听原生scroll滚动事件
      // 事件回调: (position) => { ... } position:当前滚动的位置信息对象。
      scrollVal.on('scroll', (position) => {
        // 实时派发滚动位置
        emit('scroll', position)
      })
    }
  })
  onUnmounted(() => {
    scroll.value?.destroy()
  })
  return scroll
}
